<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
  <div class="row flex-items-xs-between flex-items-xs-top" style="padding-left: 15px; padding-right: 15px;">
    <h2 class="header-title">审计日志列表</h2>
  </div>

<clr-datagrid (clrDgRefresh)="refresh($event)" class="wayne-clr-datagrid">
  <clr-dg-column class="col-id">
    <ng-container *clrDgHideableColumn="{hidden: false}">ID</ng-container>
  </clr-dg-column>
  <clr-dg-column  [clrDgField]="'user'">
    <ng-container *clrDgHideableColumn="{hidden: false}">操作用户</ng-container>
  </clr-dg-column>
  <clr-dg-column [clrDgField]="'userIp'">
    <ng-container *clrDgHideableColumn="{hidden: false}">用户IP</ng-container>
  </clr-dg-column>
  <clr-dg-column>
    <ng-container *clrDgHideableColumn="{hidden: false}">SubjectId</ng-container>
  </clr-dg-column>
  <clr-dg-column [clrDgField]="'logType'">
    <ng-container *clrDgHideableColumn="{hidden: false}">操作类型</ng-container>
  </clr-dg-column>
  <clr-dg-column [clrDgField]="'logLevel'">
    <ng-container *clrDgHideableColumn="{hidden: false}">日志级别</ng-container>
  </clr-dg-column>
  <clr-dg-column [clrDgField]="'action'">
    <ng-container *clrDgHideableColumn="{hidden: false}">Action</ng-container>
  </clr-dg-column>
  <clr-dg-column>
    <ng-container *clrDgHideableColumn="{hidden: false}">日期</ng-container>
  </clr-dg-column>
  <clr-dg-column>
    <ng-container *clrDgHideableColumn="{hidden: false}">操作详情</ng-container>
  </clr-dg-column>

  <clr-dg-row *ngFor="let al of auditLogs" [clrDgItem]="al">
    <clr-dg-cell class="col-id">{{al.id}}</clr-dg-cell>
    <clr-dg-cell>{{al.user}}</clr-dg-cell>
    <clr-dg-cell>{{al.userIp}}</clr-dg-cell>
    <clr-dg-cell>{{al.subjectId}}</clr-dg-cell>
    <clr-dg-cell>{{al.logType}}</clr-dg-cell>
    <clr-dg-cell>{{al.logLevel}}</clr-dg-cell>
    <clr-dg-cell>{{al.action}}</clr-dg-cell>
    <clr-dg-cell>{{al.createTime | date:'yyyy-MM-dd HH:mm:ss'}}</clr-dg-cell>
    <clr-dg-cell>{{al.message}}</clr-dg-cell>
  </clr-dg-row>
  <wayne-paginate
    [(currentPage)]="currentPage"
    [total]="pageState.page.totalCount"
    [pageSizes]="[10, 20, 50]"
    (sizeChange)="pageSizeChange($event)"
  >
  </wayne-paginate>
</clr-datagrid>
</div>
</div>
